html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
body {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
* {
  margin: 0;
  padding: 0;
}
.box {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.box > div > div {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.box > div .one {
  width: 100%;
  height: 100%;
  background: url(../../images/1/banner1.png) no-repeat;
  background-size: 100% 100%;
}
.box > div .one .popup {
  position: absolute;
  width: 636px;
  height: 356px;
  top: 443px;
  left: 50%;
  margin-left: -318px;
  background: #ffffff;
  border-radius: 30px;
  display: none;
}
.box > div .one .popup dl {
  width: 212px;
  float: left;
}
.box > div .one .popup dl dt {
  margin-bottom: 24px;
}
.box > div .one .popup dl dt img {
  width: 212px;
  height: 212px;
}
.box > div .one .popup dl dd {
  text-align: center;
  font-size: 24px;
  color: #333333;
}
.box > div .one .popup dl:nth-of-type(1) {
  margin: 48px 48px 0 82px;
}
.box > div .one .popup dl:nth-of-type(2) {
  margin: 48px 0 0 0;
}
.box > div .one .bg11 {
  position: absolute;
  width: 513px;
  height: 123px;
  background: url(../../images/1/i-Chengdu-2.png) no-repeat;
  background-size: 100% 100%;
  bottom: 975px;
  left: 50%;
  margin-left: -256.5px;
  animation-duration: 1.5s;
}
.box > div .one .bg12 {
  position: absolute;
  width: 364px;
  height: 706px;
  background: url(../../images/1/shouji@2x.png) no-repeat;
  background-size: 100% 100%;
  bottom: 200px;
  left: 50%;
  margin-left: -182px;
  animation-duration: 1.5s;
  animation-delay: 0.5s;
}
.box > div .one .bg13 {
  position: absolute;
  width: 180px;
  height: 58px;
  background: url(../../images/1/button@2x.png) no-repeat;
  background-size: 100% 100%;
  bottom: 110px;
  left: 50%;
  margin-left: -90px;
}
.box > div .one .bg14 {
  position: absolute;
  width: 536px;
  height: 26px;
  background: url(../../images/1/icon@2x.png) no-repeat;
  background-size: 100% 100%;
  bottom: 30px;
  left: 50%;
  margin-left: -268px;
}
.box > div .one .bg15 {
  position: absolute;
  width: 120px;
  height: 46px;
  background: url(../../images/1/plone.png) no-repeat;
  background-size: 100% 100%;
  bottom: 175px;
  right: 129px;
  animation-duration: 1s;
  animation-delay: 1.5s;
}
.box > div .one .bg6 {
  position: absolute;
  width: 36px;
  height: 20px;
  background: url(../../images/down.png) no-repeat;
  background-size: 100% 100%;
  bottom: 30px;
  left: 50%;
  margin-left: -18px;
  animation-duration: 1s;
  animation-delay: 2s;
}
.box > div .two {
  width: 100%;
  height: 100%;
  background: url(../../images/2/bg2.png) no-repeat;
  background-size: 100% 100%;
}
.box > div .two .bg21 {
  position: absolute;
  width: 554px;
  height: 141px;
  background: url(../../images/2/txt2.png) no-repeat;
  background-size: 100% 100%;
  top: 180px;
  left: 50%;
  margin-left: -277px;
  animation-duration: 2s;
}
.box > div .two .bg22 {
  position: absolute;
  width: 419px;
  height: 547px;
  background: url(../../images/2/man.png) no-repeat;
  background-size: 100% 100%;
  bottom: 280px;
  left: 50%;
  margin-left: -209.5px;
  animation-delay: 0.5s;
}
.box > div .two .bg6 {
  position: absolute;
  width: 36px;
  height: 20px;
  background: url(../../images/down.png) no-repeat;
  background-size: 100% 100%;
  bottom: 30px;
  left: 50%;
  margin-left: -18px;
  animation-duration: 1s;
  animation-delay: 2s;
}
.box > div .three {
  width: 100%;
  height: 100%;
  background: url(../../images/3/bg3.png) no-repeat;
  background-size: 100% 100%;
}
.box > div .three .bg31 {
  position: absolute;
  width: 549px;
  height: 142px;
  background: url(../../images/3/txt2.png) no-repeat;
  background-size: 100% 100%;
  top: 180px;
  left: 50%;
  margin-left: -274.5px;
  animation-duration: 1.5s;
}
.box > div .three .bg32 {
  position: absolute;
  width: 545px;
  height: 600px;
  background: url(../../images/3/city.png) no-repeat;
  background-size: 100% 100%;
  bottom: 0;
  left: 50%;
  margin-left: -272.5px;
  animation-delay: 1s;
  animation-duration: 0.5s;
}
.box > div .three .bg33 {
  position: absolute;
  width: 242px;
  height: 344px;
  background: url(../../images/3/map.png) no-repeat;
  background-size: 100% 100%;
  bottom: 490px;
  left: 274px;
  animation-delay: 1s;
}
.box > div .three .bg34 {
  position: absolute;
  width: 24px;
  height: 24px;
  background: url(../../images/3/dot.png) no-repeat;
  background-size: 100% 100%;
  bottom: 485px;
  left: 256px;
  animation-delay: 1s;
}
.box > div .three .bg6 {
  position: absolute;
  width: 36px;
  height: 20px;
  background: url(../../images/down.png) no-repeat;
  background-size: 100% 100%;
  bottom: 30px;
  left: 50%;
  margin-left: -18px;
  animation-duration: 1s;
  animation-delay: 2s;
}
.box > div .four {
  width: 100%;
  height: 100%;
  background: url(../../images/4/bg4.png) no-repeat;
  background-size: 100% 100%;
}
.box > div .four .bg41 {
  position: absolute;
  width: 491px;
  height: 315px;
  background: url(../../images/4/clound.png) no-repeat;
  background-size: 100% 100%;
  top: 100px;
  left: 136px;
  animation-delay: 0.5s;
}
.box > div .four .bg42 {
  position: absolute;
  width: 111px;
  height: 150px;
  background: url(../../images/4/ballon.png) no-repeat;
  background-size: 100% 100%;
  bottom: 907px;
  left: 272px;
  animation-duration: 1s;
  animation-delay: 2s;
}
.box > div .four .bg43 {
  position: absolute;
  width: 628px;
  height: 143px;
  background: url(../../images/4/txt.png) no-repeat;
  background-size: 100% 100%;
  bottom: 511px;
  left: 62px;
  animation-duration: 2s;
}
.box > div .four .bg44 {
  position: absolute;
  width: 711px;
  height: 338px;
  background: url(../../images/4/house.png) no-repeat;
  background-size: 100% 100%;
  bottom: 96px;
  left: 30px;
  animation-duration: 2s;
  animation-delay: 0.2s;
}
.box > div .four .bg45 {
  position: absolute;
  width: 164px;
  height: 70px;
  background: url(../../images/4/max.png) no-repeat;
  background-size: 100% 100%;
  bottom: 745px;
  left: 480px;
  animation-duration: 1s;
  animation-delay: 2s;
}
.box > div .four .bg6 {
  position: absolute;
  width: 36px;
  height: 20px;
  background: url(../../images/down.png) no-repeat;
  background-size: 100% 100%;
  bottom: 30px;
  left: 50%;
  margin-left: -18px;
  animation-duration: 1s;
  animation-delay: 2s;
}
